<template>
  <view>
    <view class="cle1"> </view>
    <view class="cle2"> </view>
    <view class="cle3"> </view>

    <view class="logo_div">
      <view class="logo">
        <img src="/static/logo.png" alt="图片不存在" />
      </view>
      <view class="logo_text">
        <view class="title">
          <p>
            <b>{{ app_name }}</b>
          </p>
        </view>
        <view class="desc">
          <p>{{ app_desc }}</p>
        </view>
      </view>
    </view>

    <view class="btn_div">
      <button
        class="btn_cs"
        style="background-color: #0ccb82; color: #fff"
        @click="login"
      >
        登录
      </button>
      <button
        class="btn_cs"
        style="background-color: #edeef2; color: #999999"
        @click="register"
      >
        注册
      </button>
    </view>
  </view>
</template>

<script>
export default {
  data() {
    return {
      app_name: "备忘录",
      app_desc: "一站式解决员工沟通、文件管理",
    };
  },
  onLoad() {},
  methods: {
    login() {
      uni.navigateTo({
        url: "/pages/login/login",
      });
    },
    register() {
          uni.navigateTo({
        url: "/pages/login/register",
      });
    },
  },
};
</script>

<style>
.cle1 {
  position: absolute;
  left: 620rpx;
  top: -110rpx;
  width: 220rpx;
  height: 220rpx;
  background-color: #0ccb82;
  border-radius: 50%;
  opacity: 0.13;
}
.cle2 {
  position: absolute;
  left: 60rpx;
  top: 66rpx;
  width: 66rpx;
  height: 66rpx;
  background-color: #0ccb82;
  border-radius: 50%;
  opacity: 0.13;
}
.cle3 {
  position: absolute;
  left: 170rpx;
  top: 170rpx;
  width: 24rpx;
  height: 24rpx;
  background-color: #0ccb82;
  border-radius: 50%;
  opacity: 0.13;
}

.btn_div {
  position: absolute;
  top: 1000rpx;
  width: 750rpx;
}
.btn_cs {
  margin: 50rpx 80rpx;
}

.logo_div {
  position: absolute;
  top: 340rpx;
  width: 750rpx;
  text-align: center;
}
.logo_text {
  position: relative;
  top: 10rpx;
}
.title {
  color: #333333;
  font-size: 32rpx;
}

.desc {
  margin-top: 30rpx;
  font-size: 28rpx;
  color: #999999;
}
</style>
